<template>
  <el-dialog
    title="案件详情"
    :close-on-click-modal="false"
    :modal-append-to-body="false"
    :visible.sync="visible"
    width="70%"
  >
    <div style="text-align: right;padding-right: 20px;">
      <!-- <el-button
        v-if="item.status == 1"
        type="button"
        size="small"
        @click="dispatch"
      >
        分配
      </el-button> -->
      <!-- <el-button
        v-if="item.status == 2"
        type="button"
        size="small"
        @click="deal"
      >
        处理
      </el-button>
      <el-button
        v-if="item.status == 3 || item.status == 5"
        type="button"
        size="small"
        @click="finishDeal"
      >
        完成处理
      </el-button>
      <el-button
        v-if="item.status == 4"
        type="button"
        size="small"
        @click="audit"
      >
        审核
      </el-button> -->
      <el-button
        v-if="item.status != 5 && item.status != 6"
        type="button"
        size="small"
        @click="close"
      >
        关闭案件
      </el-button>
    </div>

    <el-form
      class="small-space clearfix"
      :model="item"
      label-position="right"
      label-width="120px"
      style=""
    >
      <el-form-item label="案件ID:">{{ item.apply_risk_id }}</el-form-item>
      <el-form-item label="标题:">{{ item.rule_name }}</el-form-item>
      <el-form-item label="描述:">{{ item.message }}</el-form-item>
      <el-form-item label="创建时间:">{{ item.create_time }}</el-form-item>
      <el-form-item label="来源:">{{
        item.sources != '' ? sources[item.source] : ''
      }}</el-form-item>
      <el-form-item label="创建人:">{{ item.creator }}</el-form-item>
      <el-form-item label="案件标签:">{{
        item.tags != '' ? tags[item.tags] : ''
      }}</el-form-item>
      <el-form-item label="审核人:">{{ item.audit_admin_name }}</el-form-item>
      <el-form-item>
        <el-table :data="oplogs" fit border>
          <el-table-column
            label="动作"
            prop="action_text"
            align="center"
          ></el-table-column>
          <el-table-column
            label="操作人"
            prop="admin_name"
            align="center"
          ></el-table-column>
          <el-table-column
            label="说明"
            prop="desc"
            align="center"
          ></el-table-column>
          <el-table-column
            label="时间"
            prop="created_at"
            align="center"
          ></el-table-column>
        </el-table>
      </el-form-item>
      <el-form-item label="关联进件:"></el-form-item>

      <el-form-item>
        <!-- <el-dropdown
          split-button
          size="small"
          type="default"
          @command="editBatch"
        >
          批量操作
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item :command="1">通过</el-dropdown-item>
            <el-dropdown-item :command="2">拒绝</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown> -->
        <el-table
          :data="list"
          ref="multipleTable"
          @selection-change="handleSelectionChange"
          fit
          border
        >
          <!-- <el-table-column
            type="selection"
            :selectable="getSelectable"
            width="55"
          ></el-table-column> -->
          <el-table-column
            label="进件ID"
            prop="apply_risk_id"
            align="center"
          ></el-table-column>
          <el-table-column
            label="用户ID"
            prop="apply_risk_individual_id"
            align="center"
          ></el-table-column>
          <el-table-column
            label="用户名"
            prop="individual_name"
            align="center"
          ></el-table-column>
          <el-table-column
            label="身份证号"
            prop="individual_identity"
            align="center"
          ></el-table-column>
          <el-table-column
            label="进件时间"
            prop="apply_risk_created_at"
            align="center"
          ></el-table-column>
          <!-- <el-table-column label="类别" prop="trigger_type" align="left"></el-table-column> -->
          <!-- <el-table-column label="命中预警规则" prop="rule_name" align="left"></el-table-column> -->
          <!-- <el-table-column label="详细信息" prop="message" align="center" width="260"></el-table-column> -->
          <!-- <el-table-column label="记录时间" prop="update_time" align="center" width="160"></el-table-column> -->
          <!-- <el-table-column label="授信结果" align="center" width="160">
                  <template slot-scope="scope">
                  {{getverifyResult(scope.row)}}
                  </template>
              </el-table-column> -->
          <el-table-column label="详情" align="center" width="75">
            <template slot-scope="scope">
              <a
                @click="handleDetail(scope.row.apply_risk_id)"
                class="click-btn"
                >查看</a
              >
            </template>
          </el-table-column>
          <!-- <el-table-column label="操作" align="center" width="120">
            <template slot-scope="scope">
              <el-dropdown split-button size="small">
                {{
                  getVerifyStatus(
                    scope.row.operate,
                    scope.row.apply_risk_result
                  )
                }}
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item
                    @click.native="
                      handleVerifyChange(scope.row.apply_risk_id, 1)
                    "
                    :disabled="
                      scope.row.operate !== '0' ||
                        scope.row.apply_risk_result == 'refuse'
                    "
                    command="1"
                    >通过</el-dropdown-item
                  >
                  <el-dropdown-item
                    @click.native="
                      handleVerifyChange(scope.row.apply_risk_id, 2)
                    "
                    :disabled="
                      scope.row.operate !== '0' ||
                        scope.row.apply_risk_result == 'refuse'
                    "
                    command="2"
                    >拒绝</el-dropdown-item
                  >
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column> -->
        </el-table>
      </el-form-item>
    </el-form>

    <item-dispatch ref="ItemDispatch" @close="handleClose"></item-dispatch>
    <item-finishdeal
      ref="ItemFinishdeal"
      @close="handleClose"
    ></item-finishdeal>
    <item-audit ref="ItemAudit" @close="handleClose"></item-audit>
    <item-close ref="ItemClose" @close="handleClose"></item-close>
  </el-dialog>
</template>
<script>
import ItemDispatch from './dispatch.vue'
import ItemFinishdeal from './finish-deal.vue'
import ItemAudit from './audit.vue'
import ItemClose from './close.vue'
import {
  getApproval,
  getOplogs
} from '@/api/risksystem/riskWarning/caseManagement/index'
export default {
  props: [],
  data() {
    return {
      // 要提交的参数
      item: {},
      deal_recommends: [],
      tags: [],
      sources: [],
      // 菜单表单
      loading: false,
      visible: false,
      submiting: false,

      limit: 10,
      current_page: 1,
      total: 1,
      tableLoading: false,
      list: [],
      oplogs: [],

      multipleSelection: []
    }
  },
  components: {
    ItemDispatch,
    ItemAudit,
    ItemClose,
    ItemFinishdeal
  },
  methods: {
    show(row, deal_recommends, tags, sources) {
      this.visible = true
      this.item = row
      this.deal_recommends = deal_recommends
      this.tags = tags
      this.sources = sources
      this.fetchList()
      this.fetchOplogs()
      console.log(row)
    },
    handleClose() {
      console.log('close')
      this.visible = false
    },
    fetchList() {
      this.tableLoading = true
      getApproval({
        search: {
          cases_id: this.item.id
        }
      }).then(({ data }) => {
        this.list = data.list
        this.total = data.count
        this.tableLoading = false
      })
    },
    fetchOplogs() {
      this.tableLoading = true
      getOplogs({
        search: {
          id: this.item.id
        }
      }).then(({ data }) => {
        console.log(data)
        this.oplogs = data.list
        this.tableLoading = false
      })
    },
    editBatch(command) {
      let ids = this.multipleSelection.join(',')
      if (ids === '') return this.$message.error('请先选择要审批的选项')
      let _this = this
      let confirmText = ''
      if (command === 1) {
        confirmText = '是否审批为通过'
      } else if (command === 2) {
        confirmText = '是否审批为拒绝'
      }

      this.$confirm(confirmText, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        callback(item) {
          if (item === 'cancel') return
          // _this.$api.alarm
          //   .approvalEdit({
          //     data: {
          //       ids,
          //       status: command
          //     }
          //   })
          //   .then(res => {
          //     _this.fetchList()
          //     _this.$message(res.data.data.message)
          //   })
        }
      })
    },
    handleSelectionChange(val) {
      this.multipleSelection = []
      val.forEach(item => {
        this.multipleSelection.push(item.apply_risk_id)
      })
    },
    getSelectable(item) {
      return item.operate === 0 && item.apply_risk_result === 'pass'
    },
    handleVerifyChange(rowId, val) {
      let _this = this
      let confirmText = ''
      if (val === 1) {
        confirmText = '是否审批为通过'
      } else if (val === 2) {
        confirmText = '是否审批为拒绝'
      }
      this.$confirm(confirmText, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        callback(item) {
          if (item === 'cancel') return
          // _this.$api.alarm
          //   .approvalEdit({
          //     data: {
          //       ids: rowId,
          //       status: val
          //     }
          //   })
          //   .then(res => {
          //     _this.fetchList()
          //     _this.$message(res.data.data.message)
          //   })
        }
      })
    },
    getVerifyStatus(val, status) {
      if (status === 'refuse') {
        return '拒绝'
      }
      switch (val) {
        case '1':
          return '通过'
        case '2':
          return '拒绝'
        default:
          return '未操作'
      }
    },
    getverifyResult(item) {
      if (item.apply_risk_result === 'refuse') return '拒绝'
      return `通过，额度${item.apply_risk_amount}元，年利率${item.apply_risk_loan_rate}%`
    },
    handleDetail(id) {
      // window.open('#/user/report/index?apply_code=' + id)
      this.$router.push({
        path: '/risksystem/trustTrial/detail?applyRiskId=' + id
      })
    },
    dispatch() {
      this.$refs.ItemDispatch.show(this.item)
    },
    deal() {
      this.$message('处理成功')
      // this.$api.alarm
      //   .casesDeal({
      //     data: {
      //       id: this.item.id
      //     }
      //   })
      //   .then(res => {
      //     console.log(res)
      //     if (res.data.code === 0) {
      //       this.visible = false
      //     } else {
      //       this.$message.error(res.data.message)
      //     }
      //   })
    },
    finishDeal() {
      this.$refs.ItemFinishdeal.show(this.item)
    },
    audit() {
      this.$refs.ItemAudit.show(this.item)
    },
    close() {
      this.$refs.ItemClose.show(this.item)
    }
  }
}
</script>
<style lang="postcss" scoped>
.el-form-item {
  margin-bottom: 5px;
}
</style>
